<template>
  <div>
    <template>

      <Card style="width:1050px;margin: auto;">
        <row type="flex" justify="space-between">
          <i-col>
            <br>

            <span class="key" style="margin-left: 10px;margin-right: 10px;">原材料材质分类类别代码:</span>
            <Select v-model="formLeft.materialClassificationCode"  clearable filterable
                    style="width: 180px">
              <Option v-for="item in materialClassificationList" :value="item.code" :key="item.code" >{{ item.code }}--{{ item.name }}
              </Option>
            </Select>

            <span class="key" style="margin-left: 20px;margin-right: 10px">原材料材质分类代码:</span>
            <Select v-model="formLeft.categoryCode" clearable style="width: 180px" filterable>
              <Option v-for="item in CategoryFindAllList" :value="item.code" :key="item.code" >{{ item.code }}--{{ item.name }}
              </Option>
            </Select>

            <span class="key" style="margin-left: 20px;margin-right: 10px">原材料类型代码:</span>
            <Select v-model="formLeft.typeCode" clearable style="width: 180px" filterable>
              <Option v-for="item in TypeList" :value="item.code" :key="item.code" >{{ item.code }}--{{ item.name }}
              </Option>
            </Select>
            <br>
            <br>
            <span class="key" style="margin-left:10px;margin-right: 10px">原材料材质代码:</span>
            <Select v-model="formLeft.materialQualityCode" clearable style="width: 180px;margin-left: 55px" filterable>
              <Option v-for="item in MaterialQualityList" :value="item.code" :key="item.code" >{{ item.code }}--{{ item.name }}
              </Option>
            </Select>

            <span class="key" style="margin-left: 20px">弹簧代码:</span>
            <Select v-model="formLeft.springCode" clearable style="width: 180px;margin-left: 80px"  filterable>
              <Option v-for="item in SpringList" :value="item.code" :key="item.code" >{{ item.code }}--{{ item.name }}
              </Option>
            </Select>

            <span class="key" style="margin-left: 20px;margin-left: 20px">规格代码:</span>
            <Select v-model="formLeft.specificationsCode" clearable style="width: 180px;margin-left: 55px" filterable>
              <Option v-for="item in SpecificationsList" :value="item.code" :key="item.code" >{{ item.code }}--{{ item.name }}
              </Option>
            </Select>
            <br>
            <br>
            <span class="key" style="margin-left: 10px">色号代码:</span>
            <Select v-model="formLeft.colorCode" clearable style="width: 180px;margin-left: 105px" filterable>
              <Option v-for="item in colorList" :value="item.code" :key="item.code" >{{ item.code }}--{{ item.name }}
              </Option>
            </Select>

            <span class="key" style="margin-left: 20px">颜色代码:</span>
            <Select v-model="formLeft.ColourCode" clearable style="width: 180px;margin-left: 82px" filterable>
              <Option v-for="item in ColourList" :value="item.code" :key="item.code" >{{ item.code }}--{{ item.name }}
              </Option>
            </Select>

            <span class="key" style="margin-left: 20px">香味代码:</span>
            <Select v-model="formLeft.aromaCode" clearable style="width: 180px;margin-left: 55px" filterable>
              <Option v-for="item in aromaList" :value="item.code" :key="item.code" >{{ item.code }}--{{ item.name }}
              </Option>
            </Select>
            <br><br>
            <span class="key" style="margin-left: 10px">厂家代码:</span>
            <Select v-model="formLeft.ManufactorCode" clearable style="width: 180px;margin-left:105px" filterable>
              <Option v-for="item in ManufactorList" :value="item.code" :key="item.code" >{{ item.code }}--{{ item.name }}
              </Option>
            </Select>

            <span class="key" style="margin-left: 20px">型号代码:</span>
            <Select v-model="formLeft.modelCode" clearable style="width: 180px;margin-left:82px" filterable>
              <Option v-for="item in modelList" :value="item.code" :key="item.code" >{{ item.code }}--{{ item.name }}
              </Option>
            </Select>

            <span class="key" style="margin-left: 20px">物料类型:</span>
            <Select v-model="formLeft.materialType" clearable style="width: 180px;margin-left:55px" filterable>
              <Option v-for="item in materialType1" :value="item.typeName" :key="item.typeName" >{{ item.typeName }}
              </Option>
            </Select>
            <br><br>
            <span class="key" style="margin-left: 10px">包装代码:</span>
            <Select v-model="formLeft.packingCode" clearable style="width: 180px;margin-left:105px" filterable>
              <Option v-for="item in packingList" :value="item.code" :key="item.code" >{{ item.code }}--{{ item.name }}
              </Option>
            </Select>

            <br><br>
            <div style="height: 10px">
              <span class="key" style="margin-left: 10px">价格/元:</span>
              <InputNumber :max="100000" :min="0.0001" v-model="formLeft.price" :maxlength="10"
                           placeholder="请输入价格,如:0.1"
                           style="width:180px;margin-left: 100px;"></InputNumber>

              <div style="margin-left: 600px;margin-top: -35px">
                {{ formLeft.code }}
              </div>
            </div>

            <br><br>
            <span class="key" style="margin-left: 10px">描述:</span>
            <Input type="textarea" v-model="formLeft.describe" style="width:180px;margin-left: 120px"></Input>

            <span class="key" style="margin-left: 20px">合成名称:</span>
            <Input v-model="formLeft.name" style="width:180px;margin-left: 90px"></Input>
            <br><br>
            <Button type="warning" @click="find" style="float: left;margin-left: 150px">合成编码</Button>
            <Button type="primary" @click="RawMaterialUpdateById" style="float: left;margin-left: 180px">修改</Button>
            <Button type="success" style="margin-left: 180px" @click="back">返回</Button>


          </i-col>
        </row>
      </Card>


    </template>
  </div>
</template>

<script>
  import { MaterialClassificationFindAll, CategoryFindAll, TypeFindAll, MaterialQualityFindAll, SpringFindAll,
    SpecificationsFindAll, ColorFindAll, ColourFindAll, AromaFindAll, ManufactorFindAll, ModelFindAll,MaterialTypeFindAll,
    PackingFindAll,RawMaterialFindById,RawMaterialUpdateById} from "../../../api/data"

  export default {
    data() {
      return {
        page: 1,//page 第几页
        pageSize: 1000,//pageSize:每页几条数据
        materialClassificationList: [],
        CategoryFindAllList: [],
        TypeList: [],
        MaterialQualityList: [],
        SpringList: [],
        SpecificationsList: [],
        colorList: [],
        ColourList: [],
        aromaList: [],
        ManufactorList: [],
        modelList: [],
        packingList: [],
        materialType1:[],
        makingsState: '原材料',
        formLeft: {
          id:'',
          materialClassificationCode: '',
          categoryCode: '',
          typeCode: '',
          materialQualityCode: '',
          springCode: '',
          specificationsCode: '',
          colorCode: '',
          colourCode: '',
          aromaCode: '',
          manufactorCode: '',
          modelCode: '',
          packingCode: '',
          price: 0,
          materialType:'',
          code: '',
          describe: '',
          name:''
        },
      }
    },
    mounted() {
        const codeFlag = this.$route.query.id;
        if(codeFlag){
          this.formLeft.id = codeFlag;
          this.RawMaterialFindById();
          //材质分类类别
          this.MaterialClassificationFindAll();
          //弹簧
          this.SpringFindAll();
          //色号
          this.ColorFindAll();
          //颜色
          this.ColourFindAll();
          //香味
          this.AromaFindAll();
          //厂家
          this.ManufactorFindAll();
          //型号
          this.ModelFindAll();
          //包装
          this.PackingFindAll();
          //材质分类
          this.CategoryFindAll();
          //类型
          this.TypeFindAll();
          //材质
          this.MaterialQualityFindAll();
          //规格
          this.SpecificationsFindAll();
          //物料类型
          this.MaterialTypeFindAll();
        }

    },
    methods: {
      MaterialClassificationFindAll() {
        var data = {
          page: this.page,
          pageSize: this.pageSize,
          state: '1'
        };
        MaterialClassificationFindAll(data).then(data => {
          if (data.data.code == 0) {
            this.materialClassificationList = data.data.data.list;
          }
        })
      },
      CategoryFindAll() {
        var data = {
          page: this.page,
          pageSize: this.pageSize,
          makingsState: this.makingsState,
          materialClassificationCode: this.formLeft.materialClassificationCode,
          state: this.state
        };
        CategoryFindAll(data).then(data => {
          if (data.data.code == 0) {
            this.CategoryFindAllList = data.data.data.list;
          }
        })
      },
      TypeFindAll() {
        var data = {
          page: this.page,
          pageSize: this.pageSize,
          materialClassificationCode: this.formLeft.materialClassificationCode,
          state: this.state
        };
        TypeFindAll(data).then(data => {
          if (data.data.code == 0) {
            this.TypeList = data.data.data.list;
          }
        })
      },
      MaterialQualityFindAll() {
        var data = {
          page: this.page,
          pageSize: this.pageSize,
          makingsState: this.makingsState,
          materialClassificationCode: this.materialClassificationCode,
          state: this.state
        };
        MaterialQualityFindAll(data).then(data => {
          if (data.data.code == 0) {
            this.MaterialQualityList = data.data.data.list;
          }
        })
      },
      SpringFindAll() {
        var data = {
          page: this.page,
          pageSize: this.pageSize,
        };
        SpringFindAll(data).then(data => {
          if (data.data.code == 0) {
            this.SpringList = data.data.data.list;
          }
        })
      },
      SpecificationsFindAll() {
        var data = {
          page: this.page,
          pageSize: this.pageSize,
          makingsState: this.makingsState,
          state: this.state
        };
        SpecificationsFindAll(data).then(data => {
          if (data.data.code == 0) {
            this.SpecificationsList = data.data.data.list;
          }
        })
      },
      MaterialTypeFindAll() {
        var data = {
          page: this.page,
          pageSize: this.pageSize,
        };
        MaterialTypeFindAll(data).then(data => {
          if (data.data.code == 0) {
            this.materialType1 = data.data.data.list;
          }
        })
      },
      ColorFindAll() {
        var data = {
          page: this.page,
          pageSize: this.pageSize,
          state: this.state
        };
        ColorFindAll(data).then(data => {
          if (data.data.code == 0) {
            this.colorList = data.data.data.list;
          }
        })
      },
      ColourFindAll() {
        var data = {
          page: this.page,
          pageSize: this.pageSize,
          state: this.state
        };
        ColourFindAll(data).then(data => {
          if (data.data.code == 0) {
            this.ColourList = data.data.data.list;
          }
        })
      },
      AromaFindAll() {
        var data = {
          page: this.page,
          pageSize: this.pageSize,
          state: this.state
        };
        AromaFindAll(data).then(data => {
          if (data.data.code == 0) {
            this.aromaList = data.data.data.list;
          }
        })
      },
      ManufactorFindAll() {
        var data = {
          page: this.page,
          pageSize: this.pageSize,
          state: this.state
        };
        ManufactorFindAll(data).then(data => {
          if (data.data.code == 0) {
            this.ManufactorList = data.data.data.list;
          }
        })
      },
      ModelFindAll() {
        var data = {
          page: this.page,
          pageSize: this.pageSize,
          makingsState: this.makingsState,
          state: this.state
        };
        ModelFindAll(data).then(data => {
          if (data.data.code == 0) {
            this.modelList = data.data.data.list;
          }
        })
      },
      PackingFindAll() {
        var data = {
          page: this.page,
          pageSize: this.pageSize,
          state: this.state
        };
        PackingFindAll(data).then(data => {
          if (data.data.code == 0) {
            this.packingList = data.data.data.list;
          }
        })
      },
      find() {
        if (this.formLeft.categoryCode== null ||this.formLeft.categoryCode.length <= 0) {
          this.formLeft.categoryCode = 'xx'
        }
        if (this.formLeft.typeCode== null ||this.formLeft.typeCode.length <= 0) {
          this.formLeft.typeCode = 'x'
        }
        if (this.formLeft.materialQualityCode== null ||this.formLeft.materialQualityCode.length <= 0) {
          this.formLeft.materialQualityCode = 'xx'
        }
        if (this.formLeft.springCode== null ||this.formLeft.springCode.length <= 0) {
          this.formLeft.springCode = 0
        }
        if (this.formLeft.specificationsCode== null ||this.formLeft.specificationsCode.length <= 0) {
          this.formLeft.specificationsCode = 'xx'
        }
        if (this.formLeft.colorCode== null ||this.formLeft.colorCode.length <= 0) {
          this.formLeft.colorCode = 'xxx'
        }
        if (this.formLeft.ColourCode== null ||this.formLeft.ColourCode.length <= 0) {
          this.formLeft.ColourCode = 'xxxx'
        }
        if (this.formLeft.aromaCode== null ||this.formLeft.aromaCode.length <= 0) {
          this.formLeft.aromaCode = 'xx'
        }
        if (this.formLeft.ManufactorCode== null ||this.formLeft.ManufactorCode.length <= 0) {
          this.formLeft.ManufactorCode = 'xxxx'
        }
        if (this.formLeft.modelCode== null ||this.formLeft.modelCode.length <= 0) {
          this.formLeft.modelCode = 'xxxxx'
        }
        if (this.formLeft.packingCode== null ||this.formLeft.packingCode.length <= 0) {
          this.formLeft.packingCode = 'xx'
        }

        this.formLeft.code = this.formLeft.categoryCode + this.formLeft.typeCode + this.formLeft.materialQualityCode
          + this.formLeft.springCode + this.formLeft.specificationsCode + this.formLeft.colorCode + this.formLeft.ColourCode
          + this.formLeft.aromaCode + this.formLeft.ManufactorCode + this.formLeft.modelCode + this.formLeft.packingCode;
      },
      RawMaterialUpdateById() {
        RawMaterialUpdateById(this.formLeft).then(res => {
          if (res.data.code==0){
            this.$Message.success("修改成功");
            this.$router.go(-1);
          } else {
            this.$Message.error( "添加失败");
          }
        })
      },
      RawMaterialFindById(){
        var data =  {
          id:this.formLeft.id,
        }
        RawMaterialFindById(data).then(res => {
          this.formLeft = res.data.data;
        })
      },
      back() {
        this.$router.go(-1);
      },

    }
  }
</script>

<style>
  .width-condition {
    width: 150px;
    margin-left: 10px;
    margin-right: 10px;
  }

</style>
